
    <!--[if lt IE 9]><script language="javascript" type="text/javascript" src="<?php echo base_url();?>data/js/excanvas.js"></script><![endif]-->
    
    <script type="text/javascript" src="<?php echo base_url();?>data/js/jquery.jqplot.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url();?>data/js/plugins/jqplot.highlighter.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url();?>data/js/plugins/jqplot.barRenderer.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url();?>data/js/plugins/jqplot.categoryAxisRenderer.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url();?>data/js/plugins/jqplot.pointLabels.min.js"></script>
    
    <script type="text/javascript">
        $(document).ready(function(){
            var current = '#SalesAll';
            $('#categories').change(function(){
                var next;
                var value = $(this).val();
               
                $(current).hide();
                if(value == 'all') { next = '#SalesAll'; $('#type').text('KESELURUHAN'); }
                else if(value == 'food') { next = '#SalesFood'; $('#type').text('FOOD'); }
                else if(value == 'beverage') { next = '#SalesBeverage'; $('#type').text('BEVERAGE'); }
                else if(value == 'wine') { next = '#SalesWine'; $('#type').text('TAKE AWAY WINE'); }
                else if(value == 'tobaco') { next = '#SalesTobaco'; $('#type').text('TOBACO'); }
                else if(value == 'others') { next = '#SalesOthers'; $('#type').text('OTHERS'); }
                $(next).show();
                current = next;
            });
        });
    </script>
    
    <link rel="stylesheet" type="text/css" href="<?php echo base_url();?>data/css/jquery.jqplot.min.css" />

    <title>Halaman Administrasi</title>
</head>

<body onload="getTime();">

<div id="container">
  <div id="header">
    <div id="logoHeader"></div>
    <div id="accountName">
    	<div id="accountInfo">
    	  <p><b><span id="date"></span>&nbsp;<span id="clock"></span></b></p>
          <br />
          <p><i>Selamat Datang, <?php echo $nama_akun; ?></i></p>
        </div>
    </div>
  <br class="clearfloat"/>
  </div>
  <!-- end #header -->
  <div id="naviLink">
    <ul id="navUL">
    	<li><a href="<?php echo site_url('main/beranda');?>">Beranda</a></li>
    	<li><a href="<?php echo site_url('main/admin');?>">Admin</a></li>
    	<li><a href="<?php echo site_url('main/penjualan');?>">Penjualan</a></li>
    	<li><a href="<?php echo site_url('main/inventaris');?>">Inventaris</a></li>
        <li><a href="<?php echo site_url('main/pembelian');?>">Pembelian</a></li>
    	<li><a href="<?php echo site_url('main/log');?>">Log</a></li>
    </ul>
    <div id="divLogOut"><a href="<?php echo site_url('main/log_out');?>">Log Out</a></div>
  </div>
  <div id="mainContent">
  
  	<div id="contentInfo">
    	<div id="adminInfo">
        	<a>Penjualan</a>
        </div>
        <br class="clearfloat" />       
        
    </div>
    
    <form method="post" action="<?php echo site_url('main/reports');?>">
    
        <table id="TablePenjualan">
            <tr>
                <td>Bulan &amp; Tahun</td>
                <td> :
                
                    <select name="month">
                        <option value="1">Januari</option>
                        <option value="2">Februari</option>
                        <option value="3">Maret</option>
                        <option value="4">April</option>
                        <option value="5">Mei</option>
                        <option value="6">Juni</option>
                        <option value="7">Juli</option>
                        <option value="8">Agustus</option>
                        <option value="9">September</option>
                        <option value="10">Oktober</option>
                        <option value="11">Nopember</option>
                        <option value="12">Desember</option>
                    </select>
                
                    <select name="year">
                        <option value="2012">2012</option>
                        <option value="2011">2011</option>
                        <option value="2010">2010</option>
                        <option value="2009">2009</option>
                        <option value="2008">2008</option>
                    </select>
                
                </td>
            </tr>
            <tr>
                <td>Restoran</td>
                <td> :
                
                    <select name="restoran">
                        <option value="sf">Second Floor</option>
                        <option value="cox">Cox Bar</option>
                        <option value="velpa">Velpa Bar</option>
                    </select>
                
                </td>
            </tr>
            <tr>
                <td>Jenis Laporan</td>
                <td> :
                
                    <select name="type">
                        <option value="s">Penjualan/Sales</option>
                        <option value="p">Pembayaran</option>
                    </select>
                
                </td>
            </tr>
            <tr>
                <td><input id="submitButton" type="submit" value="Submit" /></td>
            </tr>
        </table>
        
    </form>
    
    <div id="DataTersembunyi" <?php echo $styleDisplay;?>>
    
    <?php 
   
    $bulan1 = null;
   
    switch (strtolower($bulan)){
        case null: break;
        case "1": $bulan1 = "Januari"; break;
        case "2": $bulan1 = "Februari"; break;
        case "3": $bulan1 = "Maret"; break;
        case "4": $bulan1 = "April"; break;
        case "5": $bulan1 = "Mei"; break;
        case "6": $bulan1 = "Juni"; break;
        case "7": $bulan1 = "Juli"; break;
        case "8": $bulan1 = "Agustus"; break;
        case "9": $bulan1 = "September"; break;
        case "10": $bulan1 = "Oktober"; break;
        case "11": $bulan1 = "Nopember"; break;
        case "12": $bulan1 = "Desember"; break;
    }
    ?>
        <div style="margin-top: 30px;"></div>
        <div id="HeaderLaporan">
            <p>Laporan <?php echo $tipe. " " .$restoran;?> Bulan <?php echo $bulan1." ".$tahun;?> </p>
        </div>
        
        <div id="DownloadLaporan">
            <a href="<?php echo site_url('main/generate_report');?>">
                <div><img src="<?php echo base_url();?>data/img/download_ico.png" /></div>
                <div id="txt">&nbsp;&nbsp;&nbsp;Download</div>
            </a>
        </div>
        
        <br class="clearfloat" />
        
        <div id="KontenLaporan">
            
            <div id="KontenLink">
            
                <ul class="mytabs">
                    <li><a href="<?php echo site_url('main/summary');?>">Summary</a></li>
                    <li <?php echo $displayHidden;?>><a href="<?php echo site_url('main/grafikKumulatif');?>">Grafik Kumulatif</a></li>
                    <li <?php echo $displayHidden;?>><a style="background-color: white" href="<?php echo site_url('main/grafikHarian');?>">Grafik Harian</a></li>
                    <li><a href="<?php echo site_url('main/grafikKategori');?>">Grafik Kategori</a></li>
                </ul>
                
            </div>
                
   <?php if(isset($sales)): ?>
            <div style="margin: 0 0 20px 2px;">
                <i>Kategori:</i>&nbsp;
                <select id="categories">
                    <option value="all">- Semua -</option>
                    <option value="food">Food</option>
                    <option value="beverage">Beverage</option>
                    <?php if(strtolower($restoran ) == "velpa") echo "<option value='wine'>Take Away Wine</option>" ?>
                    <option value="tobaco">Tobaco</option>
                    <option value="others">Others</option>
                </select>
            </div>
            
            <div style="font-size: 15px; font-weight: bold; margin-bottom: 20px;">PENJUALAN <span id="type">KESELURUHAN</span> BULAN <?php echo strtoupper($bulan1);?> TAHUN <?php echo $tahun;?></div>
            
<script>

var waktu = new Array();
var food = new Array();
var beverage = new Array();
var tobaco = new Array();
var others = new Array();
var wine_takeaway = new Array();
var subtotal = new Array();

</script>    
    
        <?php $month_to_date = 0; // cumulative subtotal
        foreach($sales as $val): 
        
        $time = strtotime($val['date']);
        
        $month_to_date += $val['subtotal'];
        
        ?>
        
<script>

food.push(<?php echo $val['food'];?>);
beverage.push(<?php echo $val['beverage'];?>);
tobaco.push(<?php echo $val['tobaco'];?>);
others.push(<?php echo $val['others'];?>);
subtotal.push(<?php echo $val['subtotal'];?>);
<?php

if(strtolower($restoran ) == "velpa"){
    echo "wine_takeaway.push({$val['wine_takeaway']})";
}
?>

</script>        
        
        <?php endforeach; ?>
            
<script>
// PENJUALAN SEMUA
$(document).ready(function(){
     
    var plot1 = $.jqplot('chartdiv1', [subtotal], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {fillToZero: true, shadow: true, barWidth: 10}
        },
        // Custom labels for the series are specified with the "label"
        // option on the series option.  Here a series option object
        // is specified for each series.
        series:[
            {label:'Total', color: '#FF9933'}
        ],
        // Show the legend and put it outside the grid, but inside the
        // plot container, shrinking the grid to accomodate the legend.
        // A value of "outside" would not shrink the grid and allow
        // the legend to overflow the container.
        legend: {
            show: true,
            placement: 'outsideGrid',
            location: 's'
        },
        axes: {
            // Use a category axis on the x axis and use our custom ticks.
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            },
            // Pad the y axis just a little so bars can get close to, but
            // not touch, the grid boundaries.  1.2 is the default padding.
            yaxis: {
                pad: 0,
                tickOptions: {formatString: 'Rp %d'}
            }
        },
        highlighter: {
            show: true,
            showMarker: false
        }
    });
});
</script>
<div id="SalesAll"> 
            <div id="chartdiv1" style="margin-top:20px; margin-left:20px; width:100%; height:500px; margin: 0 auto;"></div>
            <br /><br />
</div>


<script>
// PENJUALAN FOOD
$(document).ready(function(){
     
    var plot1 = $.jqplot('chartdiv2', [food], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {fillToZero: true, shadow: true, barWidth: 10}
        },
        // Custom labels for the series are specified with the "label"
        // option on the series option.  Here a series option object
        // is specified for each series.
        series:[
            {label:'Food', color: '#66CC99'}
        ],
        // Show the legend and put it outside the grid, but inside the
        // plot container, shrinking the grid to accomodate the legend.
        // A value of "outside" would not shrink the grid and allow
        // the legend to overflow the container.
        legend: {
            show: true,
            placement: 'outsideGrid',
            location: 's'
        },
        axes: {
            // Use a category axis on the x axis and use our custom ticks.
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            },
            // Pad the y axis just a little so bars can get close to, but
            // not touch, the grid boundaries.  1.2 is the default padding.
            yaxis: {
                pad: 0,
                tickOptions: {formatString: 'Rp %d'}
            }
        },
        highlighter: {
            show: true,
            showMarker: false
        }
    });
});
</script>
<div id="SalesFood">
            <div id="chartdiv2" style="margin-top:20px; margin-left:20px; width:100%; height:500px; margin: 0 auto;"></div>
            <br /><br />
</div>
<script>
// PENJUALAN BEVERAGE
$(document).ready(function(){
     
    var plot1 = $.jqplot('chartdiv3', [beverage], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {fillToZero: true, shadow: true, barWidth: 10}
        },
        // Custom labels for the series are specified with the "label"
        // option on the series option.  Here a series option object
        // is specified for each series.
        series:[
            {label:'Beverage', color: '#6699FF'}
        ],
        // Show the legend and put it outside the grid, but inside the
        // plot container, shrinking the grid to accomodate the legend.
        // A value of "outside" would not shrink the grid and allow
        // the legend to overflow the container.
        legend: {
            show: true,
            placement: 'outsideGrid',
            location: 's'
        },
        axes: {
            // Use a category axis on the x axis and use our custom ticks.
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            },
            // Pad the y axis just a little so bars can get close to, but
            // not touch, the grid boundaries.  1.2 is the default padding.
            yaxis: {
                pad: 0,
                tickOptions: {formatString: 'Rp %d'}
            }
        },
        highlighter: {
            show: true,
            showMarker: false
        }
    });
});
</script>
<div id="SalesBeverage">
            <div id="chartdiv3" style="margin-top:20px; margin-left:20px; width:100%; height:500px; margin: 0 auto;"></div>
            <br /><br />
</div>
<?php

if(strtolower($restoran ) == "velpa"): ?>

<script>
// PENJUALAN WINE TAKEAWAY
$(document).ready(function(){
     
    var plot1 = $.jqplot('chartdiv6', [wine_takeaway], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {fillToZero: true, shadow: true, barWidth: 10}
        },
        // Custom labels for the series are specified with the "label"
        // option on the series option.  Here a series option object
        // is specified for each series.
        series:[
            {label:'Wine Takeaway', color: '#996699'}
        ],
        // Show the legend and put it outside the grid, but inside the
        // plot container, shrinking the grid to accomodate the legend.
        // A value of "outside" would not shrink the grid and allow
        // the legend to overflow the container.
        legend: {
            show: true,
            placement: 'outsideGrid',
            location: 's'
        },
        axes: {
            // Use a category axis on the x axis and use our custom ticks.
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            },
            // Pad the y axis just a little so bars can get close to, but
            // not touch, the grid boundaries.  1.2 is the default padding.
            yaxis: {
                pad: 0,
                tickOptions: {formatString: 'Rp %d'}
            }
        },
        highlighter: {
            show: true,
            showMarker: false
        }
    });
});
</script>
<div id="SalesWine">
            <div id="chartdiv6" style="margin-top:20px; margin-left:20px; width:100%; height:500px; margin: 0 auto;"></div>
            <br /><br />
</div>

<?php
endif;

?>

<script>
// PENJUALAN TOBACO
$(document).ready(function(){
     
    var plot1 = $.jqplot('chartdiv4', [tobaco], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {fillToZero: true, shadow: true, barWidth: 10}
        },
        // Custom labels for the series are specified with the "label"
        // option on the series option.  Here a series option object
        // is specified for each series.
        series:[
            {label:'Tobaco', color: '#CC9966'}
        ],
        // Show the legend and put it outside the grid, but inside the
        // plot container, shrinking the grid to accomodate the legend.
        // A value of "outside" would not shrink the grid and allow
        // the legend to overflow the container.
        legend: {
            show: true,
            placement: 'outsideGrid',
            location: 's'
        },
        axes: {
            // Use a category axis on the x axis and use our custom ticks.
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            },
            // Pad the y axis just a little so bars can get close to, but
            // not touch, the grid boundaries.  1.2 is the default padding.
            yaxis: {
                pad: 0,
                tickOptions: {formatString: 'Rp %d'}
            }
        },
        highlighter: {
            show: true,
            showMarker: false
        }
    });
});
</script>
<div id="SalesTobaco">
            <div id="chartdiv4" style="margin-top:20px; margin-left:20px; width:100%; height:500px; margin: 0 auto;"></div>
            <br /><br />
</div>
<script>
// PENJUALAN OTHERS
$(document).ready(function(){
     
    var plot1 = $.jqplot('chartdiv5', [others], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {fillToZero: true, shadow: true, barWidth: 10}
        },
        // Custom labels for the series are specified with the "label"
        // option on the series option.  Here a series option object
        // is specified for each series.
        series:[
            {label:'Others', color: '#CCCC66'}
        ],
        // Show the legend and put it outside the grid, but inside the
        // plot container, shrinking the grid to accomodate the legend.
        // A value of "outside" would not shrink the grid and allow
        // the legend to overflow the container.
        legend: {
            show: true,
            placement: 'outsideGrid',
            location: 's'
        },
        axes: {
            // Use a category axis on the x axis and use our custom ticks.
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            },
            // Pad the y axis just a little so bars can get close to, but
            // not touch, the grid boundaries.  1.2 is the default padding.
            yaxis: {
                pad: 0,
                tickOptions: {formatString: 'Rp %d'}
            }
        },
        highlighter: {
            show: true,
            showMarker: false
        }
    });
});
</script>
<div id="SalesOthers">
            <div id="chartdiv5" style="margin-top:20px; margin-left:20px; width:100%; height:500px; margin: 0 auto;"></div>
            <br /><br />
</div>
            <?php endif; ?>
            
        </div>

    </div>
    
  	<br/>
    <!-- end #mainContent -->
  </div>
  <script>
      $(document).ready(function(){
          //$('#SalesAll').hide();
          $('#SalesFood').hide();
          $('#SalesBeverage').hide();
          $('#SalesWine').hide();
          $('#SalesTobaco').hide();
          $('#SalesOthers').hide();
      });
  </script>
  
